<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"  %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>시장통계</title>
<script src="https://www.google.com/jsapi"></script>
<script src="/Jangdolbaeng2/js/jquery-1.11.1.js"></script>
<script src="/Jangdolbaeng2/js/bootstrap.min.js"></script>
<link href="/Jangdolbaeng2/css/bootstrap.min.css" rel="stylesheet">
<link href="/Jangdolbaeng2/css/customer/common.css" rel="stylesheet">
<style type="text/css">
#shopNameOutput
{
	/* position:absolute ;*/ 
	top:400px;
	left:200px;
}

#shopDayOutput
{
	/* position:absolute; */ 
	top:400px;
	left:200px;
}

#shopWeekOutput
{
	/* position:absolute; */ 
	top:400px;
	left:200px;
}

#leftDiv
{
	top:400px;
	left:800px;
}

#rightDiv
{
	/* position:absolute;  */
	top:400px;
	left:800px;
}

</style>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});

$(document).ready(function(){
	
	init();
});	

function init()
{
	$.ajax({
		url: 'shopNameList.action',
		type: 'POST',
		dateType: 'json',
		success: shopNameOutput
	});
}

function shopNameOutput(json)
{
	$('#listDiv').html('');
	$('#my_chart').html('');
	
	var arr1 = new Array();
	var arr2 = new Array();
	
	$.each(json.totalVolumeList, function(key, item){
		arr1[key] = item.MONTH;
		arr2[key] = item.VOLUME;
	});
	
	var data = new google.visualization.DataTable();
	
	data.addColumn('string', '달');	
	data.addColumn('number', '매출액');

	
	for(i = 0; i < arr1.length; i++){
		data.addRow([arr1[i], arr2[i]]);
	}

	var options = {
		    title: '월별 총 매출액 비교',
		};
	
		
    var chart = new google.visualization.LineChart(document.getElementById('my_chart'));
    chart.draw(data, options);
	
    var str = '&nbsp';	
	str += '<div id="shopNameOutput" style="margin-top:0 auto;">';	
	str += '<center>';
	str += '<table>';
	str += '<tr>';
	str += '<td>'; 
	str += '<span style="font-family: anew; font-weight: bold;"><a href="marketStatistics.action">' + '가게별' + '</span></a>';
	str += '&nbsp;&nbsp;'; 
	str += '<span style="font-family: anew; font-weight: bold;"><a href="categoryStatistics.action">' + '카테고리별' + '</span></a>';
	str += '</td>';
	str += '</tr>';
	str += '</table>';
	str += '<br>';
	str += '<table class="table table table-striped table-hover table-bordered" style="text-align: center; width: 400px;">';	
	str += '<td  class="success" style="font-weight: bold" colspan="2">' + '가게별' + '</td>';
	$.each(json.shopNameList , function(key, item){
	str += '<tr>'; 
	str += '<td width="50">' + '<a style="color: blue;" href="' + 'javascript:weekfunc(' + item.shop_seq + ')">' + item.shop_seq + '</a>' + '</td>';
	str += '<td>' + item.name + '</td>';
	str += '</tr>';
	});
	str += '</table>'; 
	str += '</center>';
	str += '</div>';
	$('#listDiv').html(str);
}

function dayfunc(shop_seq)
{
	$.ajax({
		url: 'shopDaySales.action',
		type: 'POST',
		dateType: 'json',
		data: 
		{
			shop_seq: shop_seq
		},
		success: shopDayOutput
	});

}

function shopDayOutput(json)
{
	if(json.shopDayList == '')
	{
		alert('오늘 판매기록이 없습니다.');
		return false;
	}
	
	$('#listDiv').html('');
	$('#my_chart').html('');
	
	var arr1 = new Array();
	var arr2 = new Array();
	
	$.each(json.shopDayList, function(key, item){
		arr1[key] = item.PRODUCT_NAME;
		arr2[key] = item.VOLUME;
	});
	
	var data = new google.visualization.DataTable();
	
	data.addColumn('string', '상품이름');	
	data.addColumn('number', '매출액');

	for(i = 0; i < arr1.length; i++){
		data.addRow([arr1[i], arr2[i]]);
	}
		
	var options = {
	    title: '상품 매출액 비교',
	};
	
    var chart = new google.visualization.PieChart(document.getElementById('my_chart'));
    chart.draw(data, options);
    
 	var shopname;
    
 	$.each(json.shopDayList, function(key, item){
    	
    	shopname = item.SHOP_NAME;
    });
    
	var shopseq;
	var str = '&nbsp';	
	str += '<div id="shopDayOutput">';
	str += '<center>';
	str += '<table class="table table-striped table-hover table-bordered" style="text-align: center; width: 300px;">';
	str += '<td align="center" style="font-weight: bold">' + shopname + '</td>';
	str += '</table>';
	str += '</center>';
	str += '<br><br>';
	str += '<table class="table table table-striped table-hover table-bordered" style="text-align: center; width: 400px;">';
	str += '<td class="success" style="font-weight: bold">' + '상품' + '</td>';
	str += '<td class="success" style="font-weight: bold">' + '가격' + '</td>';
	str += '<td class="success" style="font-weight: bold">' + '개수' + '</td>';
	str += '<td class="success" style="font-weight: bold">' + '매출액' + '</td>';
	$.each(json.shopDayList, function(key, item){
	shopseq = item.SHOP_SEQ;
	str += '<tr>';
	str += '<td>' + item.PRODUCT_NAME + '</td>';
	str += '<td>' + item.PRODUCT_PRICE + '</td>';
	str += '<td>' + item.QUANTITY + '</td>';
	str += '<td>' + item.VOLUME + '</td>';
	str += '</tr>';
	});
	str += '<tr>';
	$.each(json.totalDayList, function(key, item){
	str += '<td class="success" style="font-weight: bold" colspan="4">' + '총매출: ' + item.TOTAL + '</td>';
	});
	str += '</tr>';
	str += '</table>';
	str += '<br><br>';
	str += '<center>';
	str += '<button type="button" class="btn btn-default" style="width: 100px; background-color: #62943D;"><span >' + '<a style="color: white;" href="javascript:dayfunc(' + shopseq + ')">' + '당일' + '</a>' + '</span></button>';				
	str += '<button type="button" class="btn btn-default" style="width: 100px; background-color: #62943D;"><span >' + '<a style="color: white;" href="javascript:weekfunc(' + shopseq + ')">' + '일주일' + '</a>' + '</span></button>';				
	str += '</center>';
	str += '</div>';	
	
	$('#listDiv').html(str);
	
}

function weekfunc(shop_seq)
{
	$.ajax({
		url: 'shopWeekSales.action',
		type: 'POST',
		dateType: 'json',
		data: { shop_seq: shop_seq },
		success: shopWeekOutput
	});
	
}

function shopWeekOutput(json)
{
	if(json.shopWeekList == '')
	{
		alert('일주일간 판매기록이 없습니다.');
		return false;
	}
	
	$('#listDiv').html('');
	$('#my_chart').html('');
	$('#my_chart2').html('');
	
	var arr1 = new Array();
	var arr2 = new Array();
	
	$.each(json.shopWeekList, function(key, item){
		arr1[key] = item.PRODUCT_NAME;
		arr2[key] = item.VOLUME;
	});
	
	var data = new google.visualization.DataTable();
	
	data.addColumn('string', '상품이름');	
	data.addColumn('number', '매출량');

	for(i = 0; i < arr1.length; i++){
		data.addRow([arr1[i], arr2[i]]);
	}
		
	var options = {
	    title: '상품 매출액 비교',
	};
	
    var chart = new google.visualization.PieChart(document.getElementById('my_chart'));
    chart.draw(data, options);
    
	var arr3 = new Array();
	var arr4 = new Array();
	
	$.each(json.shopMonthList, function(key, item){
		arr3[key] = item.MONTH;
		arr4[key] = item.VOLUME;
	});
	
	var data2 = new google.visualization.DataTable();
	
	data2.addColumn('string', '달');	
	data2.addColumn('number', '매출량');
	
	for(i = 0; i < arr3.length; i++){
		data2.addRow([arr3[i], arr4[i]]);
	}
	
	var options2 = {
	    title: '월 매출액 그래프',
	};
	
    var chart2 = new google.visualization.LineChart(document.getElementById('my_chart2'));
    chart2.draw(data2, options2);
    
    
 	var shopname;
    
 	$.each(json.shopWeekList, function(key, item){
    	
    	shopname = item.SHOP_NAME;
    });
    
	var shopseq;
	var str = '&nbsp';
	str += '<div id="shopWeekOutput">';
	str += '<center>';
	str += '<table class="table table-striped table-hover table-bordered" style="text-align: center; width: 300px;">';
	str += '<td align="center" style="font-weight: bold">' + shopname + '</td>';
	str += '</table>';
	str += '</center>';
	str += '<br><br>';
	str += '<table class="table table table-striped table-hover table-bordered" style="text-align: center; width: 400px;">';
	str += '<td class="success" style="font-weight: bold">' + '상품' + '</td>';
	str += '<td class="success" style="font-weight: bold">' + '가격' + '</td>';
	str += '<td class="success" style="font-weight: bold">' + '개수' + '</td>';
	str += '<td class="success" style="font-weight: bold">' + '매출액' + '</td>';
	$.each(json.shopWeekList, function(key, item){
	shopseq = item.SHOP_SEQ;
	str += '<tr>';
	str += '<td>' + item.PRODUCT_NAME + '</td>';
	str += '<td>' + item.PRODUCT_PRICE + '</td>';
	str += '<td>' + item.QUANTITY + '</td>';
	str += '<td>' + item.VOLUME + '</td>';
	str += '</tr>';
	});
	str += '<tr>';
	$.each(json.totalWeekList, function(key, item){
		str += '<td class="success" style="font-weight: bold" colspan="4">' + '총매출: ' + item.TOTAL + '</td>';
		});
	str += '</tr>';
	str += '</table>';
	str += '<br><br>';
	str += '<center>';
	str += '<button type="button" class="btn btn-default" style="width: 100px; background-color: #62943D;"><span >' + '<a style="color: white;" href="javascript:dayfunc(' + shopseq + ')">' + '당일' + '</a>' + '</span></button>';				
	str += '<button type="button" class="btn btn-default" style="width: 100px; background-color: #62943D;"><span >' + '<a style="color: white;" href="javascript:weekfunc(' + shopseq + ')">' + '일주일' + '</a>' + '</span></button>';				
	str += '</center>';	
	str += '</div>';
	
	$('#listDiv').html(str);
}


</script>
</head>
<body>
<div id="header">
	<%@ include file="adminHeader.jsp" %>
</div>

<div class="container" align="center">
	<h3 align="center" style="margin-top: 50px; margin-bottom: 20px;"><span class="glyphicon glyphicon-stats"></span> <span style="font-family: anew">시장통계</span></h3>

	<div id="wrapper" style="margin:0 auto;">
		
		<div id="listDiv" style="margin:0 auto;"></div>	
		
		<div id="rightDiv">
			<div id="my_chart" style="width: 800px; margin:0 auto; height: 500px;"></div>
		</div>
		
		<div id="leftDiv">
			<div id="my_chart2" style="width: 800px; margin:0 auto; height: 500px;"></div>
		</div>
		
	</div>	
</div>
</body>
</html>